/*------------------------------------------------------------------------------------------------------------------------------------*/
																							/*背景.基本設定*/
html,body {
	height: 100%;
	margin: 0;
	width:fixed;
}

		body{		/*背景*/	
		background-image: linear-gradient(to bottom, #dae3f6  , #ffffff 20%);		
		background-size:cover;
		background-repeat:no-repeat;
		background-attachment:fixed;
		overflow-y:scroll;		/*滑桿*/
}

.bk_gd{		/*滑動淡出*/
		z-index:2;
		box-shadow:0 0px 80px 80px rgba(218, 227, 246, 0.9); /*rgba(218, 227, 246, 0.9);	*/
		margin:-45px;
		width:100%; height:9px;
		position:fixed; top:-32px;
}

/*------------------------------------------------------------------------------------------------------------------------------------*/





/*---------------------------------------------------------------------------------------------*/
													/*網站左上角logo*/
		.logo1{
			position:relative;
			left:27px; top:27px;
			z-index:3;
		}

		.logo2{
			position:absolute;
			left:117px; top:45px;
			z-index:3;
			font-family:微軟正黑體;
			font-size:39px;
			letter-spacing:3px;
			color:blue;
			border:none;
			background:none;
		}
/*---------------------------------------------------------------------------------------------*/






.card{			/*卡片頁面 沒有字*/
	position:absolute;
	top:-54px;	
	left:-19px;
}

.container ul li a {		/*分頁標籤行*/
	position:sticky;
	left:260px; top:0px;
	font-size:25px;		
	letter-spacing:3px;
	padding:10px 27px;
	margin-left:136px;
	color:#3184a5;
	font-weight:bold;		
}


h3{			/*站點標題 */
	position:absolute;
	top:-81px;
}


		.tab-content  {				/*整張內容  各站詳細資訊排版位置*/
			letter-spacing:6px;
			position:relative;
			top:108px;
			left:27px;
}		



.tab-content h3{	/*站點標題*/
	color:#3a7992;
}


.card-icons{		/*卡片右下角圖示*/
	position:absolute;
	right:0px;
	top:103px;
}




/*-----------------------------------------------------------------------------------------------------*/
																		/*card呈現内容*/
.card-title{			/*站名*/
		letter-spacing:3px;
		display:inline-block;
	font-size:18px;
		position:relative;
		top:-3px;  left:6px;
}

.card-text{				/*地址*/
	letter-spacing:1px;
	white-space:nowrap;
	font-size:auto;
	position:relative;
	top:0px; left:6px;
	font-size:16px;
}

.more{			/*詳細資訊*/
	color:#0f9399;
	border:1px solid;
	border-color:transparent;
	position:relative;
	bottom:-3px;			/*bottom 數字越大越往上*/
	left:3px;
	background:transparent;
	border-radius:9px;
	padding-bottom:2px;
	padding-top:2px;
	padding-left:4px;
	padding-right:3px;
	letter-spacing:2px;
	transition:all .4s ease;
}

.more:hover{
	background-color:#2f8589/*#548cc4*/;
	color:white;
	border:1px solid;
	border-color:#98dee1;
	transition:all .4s ease;
}

.card-body{						/*card 内容物*/
	font-size:16px;
	white-space:nowrap;
	position:relative;
	bottom:6px; right:3px;
}

/*-----------------------------------------------------------------------------------------------------*/




.col{			/*卡片跟卡片間距*/
	margin-bottom:117px;
}


		.container{			/*整張頁面 卡片跟分頁標籤 沒有站點標題的字*/	
			font-family:微軟正黑體;			
			font-size:18px;		
			position:relative;
			top:54px;			 
			min-height: 100%;
}

/*前footer程式碼

.footer{		/*footer一整組
	position:absolute;
	left:-9px;
}


.wallpaperline{		/*fotter邊界綫

	width:1908px;
	height:18px;
	background-color:#7194b7;
	position:relative;
	bottom:-346px; left:0px;
	z-index:2;
	
}

*/

/*			前footer程式碼

.footer_text{ 			  /*footer裏的元素 内容

	position:absolute;
	bottom:180px;
	left:-108px;
	
}	



 .copy {			/*版權宣告
	position:absolute;
	top:144px; left:270px;
	letter-spacing:1px;
	font-size:15px;
	text-align:center;
	display: flex;
    justify-content: center;
    align-items: center;
	color:white;
	white-space:nowrap;
}


*/


.wallpaper{	/*只有背景*/

	height:270px; /*footer高度 數字越大越高*/
	margin-top: 333px; /*隨footer高度需做調整 越高留白越多*/
	width:90%;		
}  


.describe{		/*描述文字*/
	position:absolute;
	bottom:-261px;	left:240px;
	letter-spacing:5px;
	font-size:16px;
	padding-bottom:3px;
}

.foter_cont{
	position:absolute;		/*描述擡頭*/
	top:27px;	left:240px;
	letter-spacing:8px;
	font-size:24px;
	z-index:5;
	
}


.mb-0{	/*營業時間 標題*/
	z-index:5;
	font-size:24px;
	position:absolute;
	top:27px; left:210px;
}



.table{		/*營業時間内容*/
	position:absolute;
	left:210px; bottom:-242px;
	letter-spacing:5px;
	font-size:15px;	
}



.link_title{	/*連接 title*/
	position:absolute;
	color:white;
	top:27px;
	left:240px;
	letter-spacing:7px;
	font-size:24px;
	z-index:5;
}



/*  關於我們 聯絡我們 按鈕code
---------------------------------------------------------------------------------------------

.about{				/*關於我們 按鈕
	position:absolute;
	left:236px; bottom:-122px;
	white-space:nowrap;
	
	border:0px solid ;	
	border-color:#E3E3E3;
	font-size:16px;		
	background-color:transparent;
	border-radius:9px;
	text-decoration:none;	
	color:#E3E3E3;
/*	font-weight:bold;
	letter-spacing:3px;
	
	padding:6px 12px;
	
	transition:all .6s ease;
}

.about:hover{		/*關於我們 按鈕
	text-decoration:none;
	background-color:#E3E3E3;
	color:#0b3056;

	transition:all .4s ease;
}

.call{				/*聯絡我們 按鈕
	position:absolute;
	left:236px; bottom:-198px;
	white-space:nowrap;	
	border:0px solid #E3E3E3;		
	
	font-size:16px;		
	background-color:transparent;
	border-radius:9px;
	text-decoration:none;	
	
	color:#E3E3E3;
/*	font-weight:bold;*
	letter-spacing:3px;
	padding: 6px 12px;	
	transition:all .6s ease;
}

.call:hover{			/*聯絡我們 按鈕
	text-decoration:none;	
	background-color:#E3E3E3;
	color:#0b3056;	

	transition:all .4s ease;
}

/*---------------------------------------------------------------------------------------------*/






.card-img{			/*各站照片*/
	 display:block;
	 z-index:-1;
}





/*---------------------------------------------------------*/
											/*排版用基準綫*/
.test{		/*排版對齊綫*/
	background-color:#aaa;
	width:100%;
	height:3px;
	position:relative;
	bottom:-405px;
	
}

.test2{		/*排版對齊綫*/
	background-color:#aaa;
	width:100%;
	height:3px;
	position:relative;
	bottom:-445px;
}
/*---------------------------------------------------------*/




.card-img::before{			/*各站照片邊框模糊*/
	content:'';
	position:absolute;
	top:0px; right:0px; bottom:143px; left:0;	/*bottom數字越大底邊越往上*/
	box-shadow:0 0 6px 1px #ddd inset;
	border-radius:5px;
	margin:-1px;
}



.card{				/*全張卡片*/
		z-index:1;
		position:absolute;
		right:10px; 
		box-shadow: 0 0 2px 1px #babfc9;
	/*	hight:200px;		*/
		transition: all .4s ease;		
		
}


.card:hover{			/*卡片邊框陰影*/
		box-shadow: 0px 0px 2px 1px #778092;		
		transition: all .5s ease;
}







.show ,.show2,.show3,.show4{						/*script 動畫*/
  font-weight: 200;
  font-size: 1.8em;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  position:absolute;
  top:-81px;
}


 .oil,.adtime,
.oil2,.adtime2,
.oil3,.adtime3,
.oil4,.adtime4{						
	font-weight: 200;
  font-size: 1em;
  text-transform: uppercase;  
  letter-spacing: 0.5em;
   position:relative;
	top:81px;
	margin:20px;
	color:black;
}


/*----------------------------------------------------------------------------------------------------------*/
.tel0,.tel1,.tel2,.tel3,.tel4,.tel5,.tel6,.tel7,.tel8
,.tel9,.tel10,.tel11,.tel12,.tel13,.tel14,.tel15,.tel16
,.tel17,.tel18,.tel19,.tel20,.tel21,.tel22,.tel23,.tel24
,.tel25,.tel26,.tel27,.tel28,.tel29,.tel30,.tel31,.tel32
,.tel33,.tel34,.tel35,.tel36,.tel37,.tel38,.tel39,.tel40
																				/*聯絡電話*/
,.tel0_2,.tel1_2,.tel2_2,.tel3_2,.tel4_2,.tel5_2,.tel6_2,.tel7_2,.tel8_2
,.tel9_2,.tel10_2,.tel11_2,.tel12_2,.tel13_2,.tel14_2,.tel15_2,.tel16_2
,.tel17_2,.tel18_2,.tel19_2,.tel20_2,.tel21_2,.tel22_2,.tel23_2,.tel24_2
,.tel25_2,.tel26_2,.tel27_2,.tel28_2,.tel29_2,.tel30_2,.tel31_2,.tel32_2
,.tel33_2,.tel34_3,.tel35_2,.tel36_2,.tel37_2,.tel38_2,.tel39_2,.tel40_2
{		
	position:absolute;
	top:216px;  left:21px;
}
/*----------------------------------------------------------------------------------------------------------*/


.show .letter,	  .show2 .letter,
.show3 .letter,	  .show4 .letter
{			/*script 動畫*/
  display: inline-block;
  line-height: 1em;
}



.g_map,.g_map2,.g_map3,.g_map4{					/*google map*/
	display:block;
	position:relative;
	bottom:-360px;
}


.view,.view2,.view3,.view4 {					/*google street view*/
	display:block;
	position:relative;
	bottom:99px; left:300px;
	margin-left: 270px;
}


.img1,.img2,.img3,.img4{					/*門面照*/
	position:absolute;
	top:00px; left:500px;
}


.other,.other2,.other3,.other4{						/*洗車/自助*/
	
	position:absolute;
	top:171px; left:21px;
	font-size: 1em;
}
	


.home{					/*back to homepage*/
	color:black;
	position:absolute;
	top:0px; left:18px;
	border:1px solid;
	padding:6px;
	padding-left:12px;
	border-radius:5px;
	transition:all .5s ease;
	text-align:center;
}

.home:hover{		/*back to homepage*/
	
	color:white;
	background-color:black;	
	text-decoration:none;
	
	transition:all .5s ease;
}



/*--------------------------------------------------------------------------------------------------*/
													/*回到最上方按鈕*/
.toTop-arrow {											
	width: 4rem;
	height: 4rem;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 33%;
	opacity: 0.9;
	background: #B0B0B0;
	cursor: pointer;
	position:fixed;
	right: 2rem;
	bottom: 6rem;
	display: none;
	z-index:3;
}
.toTop-arrow::before, .toTop-arrow::after {		/*回到最上方按鈕*/
	width: 18px;
	height: 6px;
	border-radius: 3px;	
	background: #008080;	/*箭頭*/
	position: absolute;
	top:18px;
	content: "";
	transition:all .5s ease;
}
.toTop-arrow::before {										/*回到最上方按鈕*/
	transform: rotate(-50deg) translate(0, -50%);
	left: 0.9rem;
}
.toTop-arrow::after {											/*回到最上方按鈕*/
	transform: rotate(50deg) translate(0, -52%);
	right: 0.9rem;
}
.toTop-arrow:focus {outline: none;}

.toTop-arrow:hover::before,.toTop-arrow:hover::after{		/*回到最上方按鈕*/
	content: "";
	background:#072e50;
	opacity:10;
	transition:all .3s ease;
}

/*--------------------------------------------------------------------------------------------------*/



/*--------------------------------------------------------------------------------------------------*/
													/*到最下方按鈕*/				

.toBottom-arrow {											
	width: 4rem;
	height: 4rem;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 33%;
	opacity: 0.9;
	background: #B0B0B0;
	cursor: pointer;
	position:fixed;
	right: 2rem;
	bottom: 1rem;
	display: none;
	z-index:3;
}
.toBottom-arrow::before, .toBottom-arrow::after {		/*到最下方按鈕*/
	width: 18px;
	height: 6px;
	border-radius: 3px;	
	background: #008080;	/*箭頭*/
	position: absolute;
	bottom:16px;
	content: "";
	transition:all .5s ease;
}
.toBottom-arrow::before {											
	transform: rotate(50deg) translate(0, 45%);
	left: 0.9rem;
}
.toBottom-arrow::after {										
	transform: rotate(-50deg) translate(0, 48%);
	right: 0.9rem;
}
.toBottom-arrow:focus {outline: none;}						/*到最下方按鈕*/			
.toBottom-arrow:hover::before,.toBottom-arrow:hover::after{		/*到最下方按鈕*/
	content: "";
	background:#072e50;
	opacity:10;
	transition:all .3s ease;
}
/*--------------------------------------------------------------------------------------------------*/





.croline{
	  width:100%;
	  height:1px;
	  color:red;
	  position:absolute;
}